<template>
  <div id="wrapper">
    <!-- <h1 style="color:red;">1122</h1> -->
    <!-- <div class="title-box">
      <div class="title">xx</div>
    </div>
    <el-divider></el-divider>
    <div class="tab-list">
      <div
        v-for="(item, index) in tabList"
        :key="index"
        class="item"
        @click="jumpRoute(item)">
        <i class="el-icon-user"></i>
        <span class="text">{{item.label}}</span>
      </div>
    </div> -->
  </div>
</template>

<script>
export default {
  name: 'landing-page',
  components: {},
  data () {
    return {
      tabList: [
        {
          label: 'book',
          value: 'book',
          path: '/book'
        }
      ]
    }
  },
  methods: {
    jumpRoute (item) {
      const path = item.path
      this.$router.push({
        path: path,
        query: {}
      })
    },
    open (link) {
      this.$electron.shell.openExternal(link)
    }
  }
}
</script>

<style lang="scss" scoped>
#wrapper {
  padding: 10px;
}
.title-box {
  .title {
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    margin: 10px 0;
  }
}
.tab-list {
  display: flex;
  padding: 10px 30px;
  .item {
    display: flex;
    flex-direction: column;
    border: 1px solid #409eff;
    width: 120px;
    text-align: center;
    color: #409eff;
    cursor: pointer;
    border-radius: 10px;
    margin-right: 50px;
    i {
      font-size: 30px;
      margin-top: 10px;
    }
    .text {
      margin-top: 10px;
      margin-bottom: 10px;
    }
  }
}
</style>
